<template>
  <div>
    <section class="detail">
      <div class="detail">
        <table class="detail-table" cellspacing="0" cellpadding="0">
          <tr>
            <td class="label-container">业务编号</td>
            <td class="form-container">{{this.dataForm.codes}}</td>
            <td class="label-container">数据类型</td>
            <td class="form-container">{{this.dataType}}</td>
          </tr>
          <tr>
            <td class="label-container">{{this.companyType}}</td>
            <td class="form-container">{{this.dataForm.companyName}}</td>
            <td class="label-container">收款方式</td>
            <td class="form-container">{{this.getMoneyType}}</td>
          </tr>
          <tr>
            <td class="label-container">数量(吨)</td>
            <td class="form-container">{{this.dataForm.quantity}}</td>
            <td class="label-container">金额(元)</td>
            <td class="form-container">{{this.dataForm.smoney}}</td>
          </tr>
          <tr>
            <td class="label-container">运输方式</td>
            <td class="form-container">派送</td>
            <td class="label-container">运费支付方</td>
            <td class="form-container">甲方</td>
          </tr>
          <tr>
            <td class="label-container">执行开始时间</td>
            <td class="form-container">{{this.dataForm.executeStartDate}}</td>
            <td class="label-container">执行结束时间</td>
            <td class="form-container">{{this.dataForm.executeEndDate}}</td>
          </tr>
          <tr>
            <td class="label-container">是否质检</td>
            <td class="form-container">{{this.dataForm.gradeName}}</td>
            <td class="label-container">质检取样规则</td>
            <td class="form-container">{{this.dataForm.gradeCode}}</td>
          </tr>
          <tr>
            <td class="label-container">合同编号</td>
            <td class="form-container">{{this.dataForm.contractCode}}</td>
            <td class="label-container">合同签订时间</td>
            <td class="form-container">{{this.dataForm.contractDate}}</td>
          </tr>
          <tr>
            <td class="label-container">合同附件</td>
            <td class="form-container">{{this.dataForm.gradeName}}</td>
            <td class="label-container"></td>
            <td class="form-container"></td>
          </tr>
          <tr>
            <td class="label-container">备注</td>
            <td class="form-container" colspan="3">{{this.dataForm.gradeName}}</td>
          </tr>
        </table>
      </div>
<!--      <el-table-->
<!--        :show-header="false"-->
<!--        :data="tableData"-->
<!--        :span-method="objectSpanMethod"-->
<!--        border-->
<!--        :cell-style="columnStyle"-->
<!--        style="width: 100%; margin-top: 20px"-->
<!--      >-->
<!--        <el-table-column prop="id" label="id"></el-table-column>-->
<!--        <el-table-column width="250" prop="name"></el-table-column>-->
<!--        <el-table-column prop="amount1"></el-table-column>-->
<!--        <el-table-column width="250"  prop="amount2"></el-table-column>-->
<!--        <el-table-column prop="amount3"></el-table-column>-->
<!--      </el-table>-->
    </section>
  </div>
</template>
<script>
  import {getBusinessInfo} from '@/api/business/business.js'
  export default {
    name: 'mallMember-detail',
    props: ['businessId', 'businessType'],
    data () {
      return {
        // 请求回来的数据
        dataForm: {},
        getMoneyType: '',
        dataType: '',
        businessId1: '',
        companyType: '客户名称'
      }
  },
    computed: {
      // 因为数据用到了dataform中的数据，所以写在了computed中
      tableData () {
        return [
          // {
          //   id: this.dataForm.id,
          //   name: '业务编号',
          //   amount1: this.dataForm.codes,
          //   amount2: '数据类型',
          //   // amount3: this.dataForm.dataType==1?'已开票':'全部'
          //   amount3: this.dataType
          // },
          // {
          //   id: this.dataForm.id,
          //   name: '客户名称',
          //   amount1: this.dataForm.companyName,
          //   amount2: '收款方式',
          //   amount3: this.getMoneyType
          // },
          // {
          //   id: this.dataForm.id,
          //   name: '数量(吨)',
          //   amount1: this.dataForm.quantity,
          //   amount2: '金额(元)',
          //   amount3: this.dataForm.smoney
          // },
          // {
          //   id: this.dataForm.id,
          //   name: '运输方式',
          //   amount1: '派送',
          //   amount2: '运费支付方',
          //   amount3: '甲方'
          // },
          // {
          //   id: this.dataForm.id,
          //   name: '执行开始时间',
          //   amount1: this.dataForm.executeStartDate,
          //   amount2: '执行结束时间',
          //   amount3: this.dataForm.executeEndDate
          // },
          // {
          //   id: this.dataForm.id,
          //   name: '是否质检',
          //   amount1: this.dataForm.gradeName,
          //   amount2: '质检取样规则',
          //   amount3: this.dataForm.gradeCode
          // },
          // {
          //   id: this.dataForm.id,
          //   name: '合同编号',
          //   amount1: this.dataForm.contractCode,
          //   amount2: '合同签订时间',
          //   amount3: this.dataForm.contractDate
          // },
          // {
          //   id: this.dataForm.id,
          //   name: '合同附件',
          //   amount1: this.dataForm.gradeName
          // },
          // {
          //   id: this.dataForm.id,
          //   name: '备注',
          //   amount1: this.dataForm.gradeName
          // }
        ]
    }
    },
    methods: {
      // 获取列表带分页
      getInfo (businessId) {
        this.loading = true
        getBusinessInfo({
          businessId: businessId
        }).then((res) => {
          if (res.data.code === '200') {
            this.dataForm = res.data.result
            this.dataType = this.$dictUtils.getDictLabel('dataType', this.dataForm.dataType, '')
            this.getMoneyType = this.$dictUtils.getDictLabel('getMoneyType', this.dataForm.getMoneyType, '')
          }
          this.loading = false
        })
      },
      // 自定义列背景色
      // columnStyle ({ row, column, rowIndex, columnIndex }) {
      //   if (columnIndex == 0 || columnIndex == 1 || columnIndex == 3) {
      //     // 第三第四列的背景色就改变了2和3都是列数的下标
      //     return 'background:#ffffff;'
      //   } else {
      //     return 'background:#ffffff;'
      //   }
      // },

      // 和并列
      // objectSpanMethod ({ row, column, rowIndex, columnIndex }) {
      //   console.log(111)
      //
      //   if (columnIndex === 0) {
      //     if (rowIndex % 4 === 0) {
      //       return {
      //         rowspan: 0,
      //         colspan: 1
      //       }
      //     } else {
      //       return {
      //         rowspan: 0,
      //         colspan: 0
      //       }
      //     }
      //   }
      // }
    },
      mounted () {
        if (this.businessType === 2) {
            this.companyType = '供应商名称'
        }

      }
  }
</script>
<style lang="scss" scoped>
  .detail-table{
    .form-container{
    }
  }
</style>
